<template>
  <el-upload
    :before-upload="beforeUpload"
    :limit="1"
    >
    <template #trigger>
      <el-button type="primary">选择文件</el-button>
    </template>
    <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
  </el-upload>
</template>

<script setup>
import { ref } from 'vue';

const beforeUpload = (file) => {
  console.log('文件信息:', file);
  // 在这里可以添加获取文件信息的逻辑
  // 例如：获取文件名、文件大小等
  const isJPG = file.type === 'image/jpeg';
  const isLt2M = file.size / 1024 / 1024 < 0.5;

  if (!isJPG) {
    this.$message.error('上传头像图片只能是 JPG 格式!');
  }
  if (!isLt2M) {
    this.$message.error('上传头像图片大小不能超过 500kb!');
  }
  return isJPG && isLt2M;
};
</script>